<template>
	<promoter v-if="nodeConfig.type == 0" v-model="nodeConfig"></promoter>

	<approver v-if="nodeConfig.type == 1" v-model="nodeConfig" ></approver>

	<send v-if="nodeConfig.type == 2" v-model="nodeConfig" ></send>

	<branch v-if="nodeConfig.type == 4" v-model="nodeConfig" >
		<template v-slot="slot">
			<node-wrap v-if="slot.node" v-model="slot.node.childNode" ></node-wrap>
		</template>
	</branch>

	<parallel v-if="nodeConfig.type == 5" v-model="nodeConfig" >
		<template v-slot="slot">
			<node-wrap v-if="slot.node" v-model="slot.node.childNode" ></node-wrap>
		</template>
	</parallel>

	<node-wrap v-if="nodeConfig.childNode" v-model="nodeConfig.childNode" :currentNode="nodeConfig" ></node-wrap>
</template>

<script setup>
import approver from './nodes/approver.vue'
import promoter from './nodes/promoter.vue'
import branch from './nodes/branch.vue'
import send from './nodes/send.vue'
import parallel from './nodes/parallel.vue'
import {onMounted, ref,watch} from 'vue'
const props = defineProps({
	modelValue: { type: Object, default: () => { } }
})
const emit = defineEmits(['update:modelValue'])
const nodeConfig = ref(JSON.parse(JSON.stringify(props.modelValue)))
watch(nodeConfig, (newValue) => {
    emit('update:modelValue',newValue)
}, {
    deep: true
})
</script>

<style></style>
